<div class="row">
    <div class="col-lg-12">
        <div class="wrapper wrapper-content animated fadeInup">
            <ul class="notes">
                <?php foreach ($pings as $item): ?>
                    <li>
                        <div>
                            <small><?php echo date('Y-m-d H:m:s', $item['ping_create_time']); ?></small>
                            <h4><?php echo $item['ping_title'] ?></h4>
                            <p><?php echo $item['ping_content'] ?></p>
                            <a data-toggle="modal" href="#pin-modal"><i class="fa fa-comment-o"></i></a>
                        </div>
                    </li>
                <?php endforeach; ?>
            </ul>
        </div>  
    </div>
</div>
<!--pinmodal-->
<div id="pin-modal" class="modal fade" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-body">
                <div class="row">
                    <h3>不准骂我 <i class="fa fa-reddit"></i> <i class="fa fa-reddit"></i> <i class="fa fa-reddit"></i></h3>
                    <p>有话好说,请不要sql注入<br>(表单验证我根本没做啊~) <i class="fa fa-angellist"></i></p>
                    <form role="form">
                        <div class="form-group">
                            <input type="text" name="pin-title" id="pin-title" class="form-control">
                        </div>
                        <div class="form-group">
                            <input type="text" name="pin-content" id="pin-content" class="form-control">
                        </div>
                        <div class="form-group">
                            <button type="button" class="btn btn-sm btn-primary" id="pin-send-btn">GO!</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>
</div>
<!--pinmodal-->

<div class="footer">
    <div class="pull-right">
        Lei Zhang &copy; 2015-2016 粤ICP备16020962号
    </div>
</div>
</div>
</div>

<!-- Mainly scripts -->
<link href="/static/css/plugins/sweetalert/sweetalert.css" rel="stylesheet">
<script src="/static/js/jquery-2.1.1.js"></script>
<script src="/static/js/bootstrap.min.js"></script>
<script src="/static/js/plugins/sweetalert/sweetalert.min.js"></script>
<script src="/static/js/plugins/metisMenu/jquery.metisMenu.js"></script>
<script src="/static/js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
<!-- Custom and plugin javascript -->
<script src="/static/js/inspinia.js"></script>
<script src="/static/js/plugins/pace/pace.min.js"></script>

<script>
    $(function () {

        var rComment = /\/\*([\s\S]*?)\*\//;

        // 对Date的扩展，将 Date 转化为指定格式的String   
        // 月(M)、日(d)、小时(h)、分(m)、秒(s)、季度(q) 可以用 1-2 个占位符，   
        // 年(y)可以用 1-4 个占位符，毫秒(S)只能用 1 个占位符(是 1-3 位的数字)   
        // 例子：   
        // (new Date()).Format("yyyy-MM-dd hh:mm:ss.S") ==> 2006-07-02 08:09:04.423   
        // (new Date()).Format("yyyy-M-d h:m:s.S")      ==> 2006-7-2 8:9:4.18   
        Date.prototype.Format = function (fmt)
        {
            var o = {
                "M+": this.getMonth() + 1, //月份   
                "d+": this.getDate(), //日   
                "h+": this.getHours(), //小时   
                "m+": this.getMinutes(), //分   
                "s+": this.getSeconds(), //秒   
                "q+": Math.floor((this.getMonth() + 3) / 3), //季度   
                "S": this.getMilliseconds()             //毫秒   
            };
            if (/(y+)/.test(fmt))
                fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
            for (var k in o)
                if (new RegExp("(" + k + ")").test(fmt))
                    fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
            return fmt;
        }

        $('#pin-send-btn').on('click', function () {
            var pin_title = $('#pin-title').val();
            var pin_content = $('#pin-content').val();

            if (!pin_title || !pin_content) {
                $('#pin-title,#pin-content').addClass('error');
                return;
            }

            var pin_time = new Date().Format("yyyy-MM-dd hh:mm:ss");

            $.post('/welcome/ajax_set_ping_config', {
                ping_title: pin_title,
                ping_content: pin_content
            }, function (ret) {
                console.log(ret);
                if (ret) {
                    swal({
                        title: "Thank You!",
                        text: "如果没出bug,你的浏览应该在第一个!",
                        type: "success"
                    });
                    var template = '<li><div><small>'
                            + pin_time + '</small><h4>'
                            + pin_title + '</h4><p>'
                            + pin_content
                            + '</p><a data-toggle="modal" href="#pin-modal"><i class="fa fa-comment-o"></i></a></div></li>';
                    $(template).prependTo($('ul.notes'));
                    $('#pin-modal').modal('hide');
                    $('html, body').animate({scrollTop: 0}, 'fast');
                } else {
                    $('#pin-title,#pin-content').addClass('error');
                }
            });
        });

        function ms(fn) {
            return fn.toString().match(rComment)[1];
        }


    });
</script>

</body>

</html>



